<template>
  <div class="nav-wrapper">
    <ul class="nav-extra">
        <li class="item">
            <div class="trigger">欢迎回来，{{username}}</div>            
        </li>
        <li class="item">
          <div class="trigger">
            <a @click="logout">注销</a>
          </div>
        </li>
        <li class="item">
            <div class="trigger">
                <router-link to="">联系我们</router-link>
            </div>
        </li>
    </ul>
    <ul class="nav-bar">
      <li class="item">
        <router-link to="/home">首页</router-link>
      </li>
      <li class="item">
        <router-link to="/list">数据接口</router-link>
      </li>
      <li class="item">
        <router-link to>数据块</router-link>
      </li>
      <li class="item">
        <router-link to>营商环境分析</router-link>
      </li>
      <li class="item stretched">
        <input type="text" class="textbox" placeholder="找数据，点这里" />
        <button type="button" class="btn">
            <i class="icon icon-search"></i>
        </button>
      </li>
    </ul>
  </div>
</template>

<script>
export default {
  name: "",
  data() {
    return {
        username:null
    };
  },
  created(){
    this.username = this.$store.getters.getUserName 
  },
  methods:{
    logout(){
      this.$store.dispatch('logout')
      this.$router.push('login')
    }
  }
};
</script>

<style scoped>
</style>